<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=UTF-8"> 
<%@ taglib uri="http://java.sun.com/portlet_2_0" prefix="portlet" %>
<%@ taglib uri="http://liferay.com/tld/aui" prefix="aui"%>
<%@ taglib uri="http://liferay.com/tld/ui" prefix="liferay-ui"%>
<portlet:defineObjects />
 
<portlet:actionURL name="upload" var="uploadFileURL"></portlet:actionURL>
<portlet:actionURL name="createFolder" var="createFolderURL"></portlet:actionURL>
<portlet:resourceURL var="resourceURL"/>
<portlet:resourceURL var='test' id='test' />
<portlet:resourceURL var='loadTree' id='loadTree' />
<portlet:resourceURL var='loadFtpTree' id='loadFtpTree' />
<portlet:resourceURL var='addKho' id='addKho' />
<portlet:resourceURL var='addTu' id='addTu' />
<portlet:resourceURL var='addKe' id='addKe' />
<portlet:resourceURL var='addHop' id='addHop' />
<portlet:resourceURL var='addFile' id='addFile' />
 <!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Đo đạc 1234</title>
    <link href="<%=request.getContextPath()%>/css/map.css" type="text/css" rel="stylesheet" />
    <link href="<%=request.getContextPath()%>/css/control_map.css" type="text/css" rel="stylesheet" />
    <link href="<%=request.getContextPath()%>/css/contextmenu.css" type="text/css" rel="stylesheet" />
    <link href="<%=request.getContextPath()%>/css/google.css" type="text/css" rel="stylesheet" />
    <link href="<%=request.getContextPath()%>/js/jquery/jqwidgets/styles/jqx.base.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="<%=request.getContextPath()%>/css/common.css" type="text/css" media="screen" />
    <link rel="stylesheet" href="<%=request.getContextPath()%>/css/jquery.treeview.css" type="text/css" />
    <link rel="stylesheet" href="<%=request.getContextPath()%>/css/tooltipster.css" type="text/css" />
    <link rel="stylesheet" href="<%=request.getContextPath()%>/css/uniform.default.css" type="text/css" media="screen" />
    <link href="<%=request.getContextPath()%>/css/colorbox.css" rel="stylesheet" type="text/css" media="screen" />
    <link href="<%=request.getContextPath()%>/css/jquery.mCustomScrollbar.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
	<link rel="stylesheet" href="<%=request.getContextPath()%>/js/jstree/dist/themes/default/style.min.css" />
    <!-- Customer js and css -->

    <link href="<%=request.getContextPath()%>/css/custom-theme/jquery-ui-1.10.4.custom.css" rel="stylesheet" type="text/css" />
    <link href="<%=request.getContextPath()%>/css/cssHeader.css" rel="stylesheet"
          type="text/css" />
          
	<script src="<%=request.getContextPath()%>/js/chauJs/orange-tree.js"></script>
    <script type="text/javascript"
            src="<%=request.getContextPath()%>/js/ui/jquery-1.8.3.min.js"></script>
            
	<script src="<%=request.getContextPath()%>/js/jstree/dist/jstree.js"></script>
    <script type="text/javascript"
            src="<%=request.getContextPath()%>/js/js_dodac/notify.js"></script>

    <script type="text/javascript"
            src="<%=request.getContextPath()%>/js/js_dodac/common.js"></script>
    <script type="text/javascript"
            src="<%=request.getContextPath()%>/js/jquery.cookie.js"></script>




    <script src="<%=request.getContextPath()%>/js/jquery/jqwidgets/jqxcore.js"
            type="text/javascript"></script>
    <script src="<%=request.getContextPath()%>/js/jquery/jqwidgets/jqxbuttons.js"
            type="text/javascript"></script>
    <script src="<%=request.getContextPath()%>/js/jquery/jqwidgets/jqxscrollbar.js"
            type="text/javascript"></script>
    <script src="<%=request.getContextPath()%>/js/jquery/jqwidgets/jqxpanel.js"
            type="text/javascript"></script>
    <script src="<%=request.getContextPath()%>/js/jquery/jqwidgets/jqxtree.js"
            type="text/javascript"></script>
    <script src="<%=request.getContextPath()%>/js/jquery/jqwidgets/jqxexpander.js"
            type="text/javascript"></script>
    <script src="<%=request.getContextPath()%>/js/jquery/jqwidgets/jqxsplitter.js"
            type="text/javascript"></script>
    <script src="<%=request.getContextPath()%>/js/jquery.form.js"
            type="text/javascript"></script>
    <script type="text/javascript"
            src="<%=request.getContextPath()%>/js/ui/jquery.sizes.js"></script>
    <script type="text/javascript"
            src="<%=request.getContextPath()%>/js/ui/jlayout.border.js"></script>
    <script type="text/javascript"
            src="<%=request.getContextPath()%>/js/ui/jquery.jlayout.js"></script>
    <script type="text/javascript"
            src="<%=request.getContextPath()%>/js/ui/jlayout.grid.js"></script>
    <script type="text/javascript"
            src="<%=request.getContextPath()%>/js/ui/jlayout.flexgrid.js"></script>
    <script type="text/javascript"
            src="<%=request.getContextPath()%>/js/ui/jlayout.flow.js"></script>
    <script type="text/javascript"
            src="<%=request.getContextPath()%>/js/ui/jquery.treeview.js"></script>
    <script type="text/javascript"
            src="<%=request.getContextPath()%>/js/ui/jquery.tooltipster.min.js"></script>
    <script type="text/javascript"
            src="<%=request.getContextPath()%>/js/ui/jquery.event.drag-2.2.js"></script>
    <script type="text/javascript"
            src="<%=request.getContextPath()%>/js/ui/jquery.uniform.min.js"></script>
    <script type="text/javascript"
            src="<%=request.getContextPath()%>/js/ui/jquery.colorbox.js"></script>
    <script type="text/javascript"
            src="<%=request.getContextPath()%>/js/ui/jquery-ui.js"></script>
    <script type="text/javascript"
            src="<%=request.getContextPath()%>/js/jquery.mCustomScrollbar.js"></script>
    <script>
	    $(document).ready(function() {
	        $('.hide').hide();
	        $("#ftpInfo").click(function(){
	        	$('.hide').hide();
	        	$(".ftpInfoDiv").show();
	        });
	        $("#sizeAndType").click(function(){
	        	$('.hide').hide();
	        	$(".sizeAndTypeDiv").show();
	        });
	        $("#backupAndRestore").click(function(){
	        	$('.hide').hide();
	        	$(".backupAndRestoreDiv").show();
	        });
	        $("#downloadAllFolder").click(function(){
	        	$('.hide').hide();
	        	$(".downloadAllFolderDiv").show();
	        });
	        $("#searchFolder").click(function(){
	        	$('.hide').hide();
	        	$(".downloadAllFolderDiv").show();
	        });
	        var test = "<%=test%>"
	        var loadTree = "<%=loadTree%>"
		    var loadFtpTree = "<%=loadFtpTree%>"
			var addKho = "<%=addKho%>"
			var addTu = "<%=addTu%>"
			var addKe = "<%=addKe%>"
			var addHop = "<%=addHop%>"
			var addFile = "<%=addFile%>"
	        $("#ftpInfoDivBut").click(function(){
	        	$.ajax({
	        		url: test, 
	        		data: {
	        			server: $("#ServerFtp").val(),
	        			username: $("#UserNameFtp").val(),
	        			password: $("#PasswordFtp").val(),
	        			port: $("#PortFtp").val()
	        		},
	        		dataType: 'json',
	        		success: function(data){
	        			var obj = JSON.parse(data);
	        			console.log(obj);
	        			console.log(data);
	                    alert(obj);
	            	},
	            	error: function(xhr, ajaxOptions, thrownError) {
	            	     alert(xhr.status + " - " + xhr.statusText);
	            	    },
	            	type: 'POST'
	        	});

	        });
	        $("#configCode").click(function(){
	        	$.ajax({
	        		url: loadTree, 
	        		data: {
	        		},
	        		dataType: 'json',
	        		success: function(data){
	        			if (typeof console == "undefined") {
	        			    window.console = {
	        			        log: function () {}
	        			    };
	        			}

	        			console.log(data);
	        			var json1 = JSON.parse(data.folder);
	        			//var json = JSON.parse('{"text":"kho 1","type":"kho","children":[{"text":"tu 1","type":"tu","children":[]},{"text":"tu 2","type":"tu","children":[]},{"text":"tu 3","type":"tu","children":[]},{"text":"tu 4","type":"tu","children":[]},{"text":"tu 5","type":"tu","children":[{"text":"ke 5.1","type":"ke","children":[{"text":"hop 5.1.1","type":"hop","children":[{"text":"HoSoDoDac.docx","type":"file","children":[]},{"text":"AnhDoDac.jpg","type":"file","children":[]},{"text":"QuyetDinh.docx","type":"file","children":[]}]}]}]}]}');
                        $('#jstree_demo').jstree({
							"core" : {
								"animation" : 0,
								"check_callback" : true,
								"themes" : { "stripes" : true },
								'dataType': 'JSON',
								'data' : [json1]
							},
							"types" : {
								//"#" : { "max_children" : 1, "max_depth" : 4, "valid_children" : ["root"] },
								"root" : { "valid_children" : ["kho"] },
								"kho" : { "icon" : "<%=request.getContextPath()%>/img/home1.png", "valid_children" : ["tu"] },
								//"default" : { "valid_children" : ["default","file"] },
								"tu" : { "icon" : "<%=request.getContextPath()%>/img/folder1.png", "valid_children" : ["ke"] },
								"ke" : { "icon" : "<%=request.getContextPath()%>/img/folder1.png", "valid_children" : ["hop"] },
								"hop" : { "icon" : "<%=request.getContextPath()%>/img/folder1.png", "valid_children" : ["file"] },
								"file" : { "icon" : "<%=request.getContextPath()%>/img/file1.png", "valid_children" : [] }
							},
							"plugins" : [ "contextmenu", "dnd", "search", "state", "types", "wholerow" ]
							//"plugins" : ["types"]
						});
	            	},
	            	error: function(xhr, ajaxOptions, thrownError) {
	            	     alert(xhr.status + " - " + xhr.statusText);
	            	    },
	            	type: 'POST'
	        	});
	        });

		    $("#ftpTree").click(function(){
	        	$.ajax({
	        		url: loadFtpTree, 
	        		data: {
	        		},
	        		dataType: 'json',
	        		success: function(data){
	        			if (typeof console == "undefined") {
	        			    window.console = {
	        			        log: function () {}
	        			    };
	        			}

	        			console.log(data);
	        			var json1 = JSON.parse(data.folder);
	        			//var json = JSON.parse('{"text":"kho 1","type":"kho","children":[{"text":"tu 1","type":"tu","children":[]},{"text":"tu 2","type":"tu","children":[]},{"text":"tu 3","type":"tu","children":[]},{"text":"tu 4","type":"tu","children":[]},{"text":"tu 5","type":"tu","children":[{"text":"ke 5.1","type":"ke","children":[{"text":"hop 5.1.1","type":"hop","children":[{"text":"HoSoDoDac.docx","type":"file","children":[]},{"text":"AnhDoDac.jpg","type":"file","children":[]},{"text":"QuyetDinh.docx","type":"file","children":[]}]}]}]}]}');
	                    $('#jstree_ftp').jstree({
							"core" : {
								"animation" : 0,
								"check_callback" : true,
								"themes" : { "stripes" : true },
								'dataType': 'JSON',
								'data' : [json1]
							},
							"types" : {
								//"#" : { "max_children" : 1, "max_depth" : 4, "valid_children" : ["root"] },
								"kho" : { "icon" : "<%=request.getContextPath()%>/img/home1.png", "valid_children" : ["tu","file"] },
								//"default" : { "valid_children" : ["default","file"] },
								"tu" : { "icon" : "<%=request.getContextPath()%>/img/folder1.png", "valid_children" : ["ke","file"] },
								"ke" : { "icon" : "<%=request.getContextPath()%>/img/folder1.png", "valid_children" : ["hop","file"] },
								"hop" : { "icon" : "<%=request.getContextPath()%>/img/folder1.png", "valid_children" : ["file"] },
								"file" : { "icon" : "<%=request.getContextPath()%>/img/file1.png", "valid_children" : [] }
							},
							"plugins" : [ "contextmenu", "dnd", "search", "state", "types", "wholerow" ]
							//"plugins" : ["types"]
						});
	            	},
	            	error: function(xhr, ajaxOptions, thrownError) {
	            	     alert(xhr.status + " - " + xhr.statusText);
	            	    },
	            	type: 'POST'
	        	});
	        });
		    $("#btnAddKho").click(function(){
	        	$.ajax({
	        		url: addKho, 
	        		data: {
	        			ten: $("#kho_name").val()
	        		},
	        		dataType: 'json',
	        		success: function(data){
	        			var obj = eval(data);
	        			//var obj = JSON.parse(data);
	        			console.log(obj);
	        			console.log($("#jstree_demo").jstree("get_selected")[0]);
	        			var parentId = "#" + $("#jstree_demo").jstree("get_selected")[0];
	        			$("#jstree_demo").jstree("create_node", parentId, "first", obj, false, true);
	            	},
	            	error: function(xhr, ajaxOptions, thrownError) {
	            	     alert(xhr.status + " - " + xhr.statusText);
	            	    },
	            	type: 'POST'
	        	});

	        });
		    $("#btnAddTu").click(function(){
	        	$.ajax({
	        		url: addTu, 
	        		data: {
	        			ten: $("#tu_name").val(),
	        			ma: $("#kho_code").val()
	        		},
	        		dataType: 'json',
	        		success: function(data){
	        			var obj = eval(data);
	        			//var obj = JSON.parse(data);
	        			console.log(obj);
	        			var parentId = "#" + $("#jstree_demo").jstree("get_selected")[0];
	        			console.log(parentId);
	        			$("#jstree_demo").jstree("create_node", parentId, "first", obj, false, true);
	            	},
	            	error: function(xhr, ajaxOptions, thrownError) {
	            	     alert(xhr.status + " - " + xhr.statusText);
	            	    },
	            	type: 'POST'
	        	});

	        });
		    $("#btnAddKe").click(function(){
	        	$.ajax({
	        		url: addKe, 
	        		data: {
	        			ten: $("#ke_name").val(),
	        			ma: $("#tu_code").val()
	        		},
	        		dataType: 'json',
	        		success: function(data){
	        			var obj = eval(data);
	        			//var obj = JSON.parse(data);
	        			console.log(obj);
	        			var parentId = "#" + $("#jstree_demo").jstree("get_selected")[0];
	        			console.log(parentId);
	        			$("#jstree_demo").jstree("create_node", parentId, "first", obj, false, true);
	            	},
	            	error: function(xhr, ajaxOptions, thrownError) {
	            	     alert(xhr.status + " - " + xhr.statusText);
	            	    },
	            	type: 'POST'
	        	});

	        });
		    $("#btnAddHop").click(function(){
	        	$.ajax({
	        		url: addHop, 
	        		data: {
	        			ten: $("#hop_name").val(),
	        			ma: $("#ke_code").val()
	        		},
	        		dataType: 'json',
	        		success: function(data){
	        			var obj = eval(data);
	        			//var obj = JSON.parse(data);
	        			console.log(obj);
	        			var parentId = "#" + $("#jstree_demo").jstree("get_selected")[0];
	        			console.log(parentId);
	        			$("#jstree_demo").jstree("create_node", parentId, "first", obj, false, true);
	            	},
	            	error: function(xhr, ajaxOptions, thrownError) {
	            	     alert(xhr.status + " - " + xhr.statusText);
	            	    },
	            	type: 'POST'
	        	});

	        });
		    $("#btnAddFile").click(function(){
	        	$.ajax({
	        		url: addFile, 
	        		data: {
	        			ten: $("#file_name").val(),
	        			ma: $("#hop_code").val(),
	        			file: $("#fileupload").val()
	        		},
	        		dataType: 'json',
	        		success: function(data){
	        			var obj = eval(data);
	        			//var obj = JSON.parse(data);
	        			console.log(obj);
	        			console.log($("#jstree_demo").jstree("get_selected")[0]);
	        			$("#jstree_demo").jstree("create_node", $("#jstree_demo").jstree("get_selected"), "first", obj, false, true);
	            	
	            	},
	            	error: function(xhr, ajaxOptions, thrownError) {
	            	     alert(xhr.status + " - " + xhr.statusText);
	            	    },
	            	type: 'POST'
	        	});

	        });
	    });
    	$(function () {
            $("select, input:text, textarea, input:checkbox, input:radio, input:file").uniform({});
        });
    	
        <%-- function callServeResource(){
            AUI().use('aui-io-request', function(A){
				A.io.request('<%=resourceURL.toString()%>', {
                   	method: 'post',
                   	dataType: 'json',
                   	form: {
                    	id: 'fm'
					},
					on: {
						success: function() {
                            alert(this.get('responseData').folder);
                            var json = JSON.parse('{"text":"kho 1","type":"kho","children":[{"text":"tu 1","type":"tu","children":[]},{"text":"tu 2","type":"tu","children":[]},{"text":"tu 3","type":"tu","children":[]},{"text":"tu 4","type":"tu","children":[]},{"text":"tu 5","type":"tu","children":[{"text":"ke 5.1","type":"ke","children":[{"text":"hop 5.1.1","type":"hop","children":[{"text":"HoSoDoDac.docx","type":"file","children":[]},{"text":"AnhDoDac.jpg","type":"file","children":[]},{"text":"QuyetDinh.docx","type":"file","children":[]}]}]}]}]}');
                            $('#jstree_demo').jstree({
								"core" : {
									"animation" : 0,
									"check_callback" : true,
									"themes" : { "stripes" : true },
									'dataType': 'JSON',
									'data' : [json]
								},
								"types" : {
									//"#" : { "max_children" : 1, "max_depth" : 4, "valid_children" : ["root"] },
									"kho" : { "icon" : "<%=request.getContextPath()%>/img/home1.png", "valid_children" : ["tu","file"] },
									//"default" : { "valid_children" : ["default","file"] },
									"tu" : { "icon" : "<%=request.getContextPath()%>/img/folder1.png", "valid_children" : ["ke","file"] },
									"ke" : { "icon" : "<%=request.getContextPath()%>/img/folder1.png", "valid_children" : ["hop","file"] },
									"hop" : { "icon" : "<%=request.getContextPath()%>/img/folder1.png", "valid_children" : ["file"] },
									"file" : { "icon" : "<%=request.getContextPath()%>/img/file1.png", "valid_children" : [] }
								},
								"plugins" : [ "contextmenu", "dnd", "search", "state", "types", "wholerow" ]
								//"plugins" : ["types"]
							});
						}
					}
                });
            });
        } --%>
        function saveFtpInfo(){
            AUI().use('aui-io-request', function(A){
				A.io.request('<%=resourceURL.toString()%>', {
                   	method: 'post',
                   	dataType: 'json',
                   	form: {
                    	id: 'fm1'
					},
					on: {
						success: function() {
                            alert("Đã lưu cài đặt!");
                            
						}
					}
                });
            });
        }
    </script>
</head>
<body style="width: 100%; height: 100%;">
	
    <div id="container" class="plan-child">
        <div class="navigation">
            <span id="ctl00_lblMenu">
                <ul id="hb-menu">
                    <li class="active-bg"><a href="#">Đo đạc</a>
                    <li>
                        <!--<li><a href="#">Thông tin mạng lưới</a></li>
                        <li><a href="#">Thông tin scada</a></li>-->
                    <li style="float: right; margin-right: 1px;">
                        <table>
                            <tr>
                                <td>
                                    <input type="text" class="txt" id="txtTimKiemChung"
                                           style="width: 200px ! important; padding: 0 10px ! important; height: 30px ! important;">
                                </td>
                                <td>
                                    <input type="button" id="btnTimKiemChung" class="but"
                                           value="Tìm kiếm"
                                           style="height: 32px ! important; padding: 0 10px ! important;">
                                </td>
                            </tr>
                        </table>
                    </li>
                </ul>
            </span>
        </div>
    </div>
    
    <div id="divMapBody_Main" style="width: 100%; height: 600px; border-left: 1px solid #dbdbdb;">
        <div id="accordion-resizer" class="ui-widget-content"
             style="width: 25.33%; float: left; height: 100%; border: 0;">
            <div id="divLeftPanel"
                 style="width: 100%; height: 90%; overflow: auto;">
                <div class="group">
                    <h3>Thiết lập thông tin kho</h3>
                    <div style="padding: 0 !important;">
                        <ul id="" class="ul_Map_QuanLyDLBD">
                            <li>
                                <a class="ftpInfo" id="ftpInfo" href="#">
                                    <img src="<%=request.getContextPath()%>/img/view_list.png">
                                    Thiết lập thông tin FTP
                                </a>
                            </li>

                            <li>
                                <a class="sizeAndType" id="sizeAndType" href="#">
                                    <img src="<%=request.getContextPath()%>/img/view_list.png">
                                    Kích thước và kiểu dữ liệu
                                </a>
                            </li>
                            <li>
                                <a class="backupAndRestore" id="backupAndRestore" href="#">
                                    <img src="<%=request.getContextPath()%>/img/view_list.png">
                                    Sao lưu và phục hồi
                                </a>
                            </li>
                        </ul>

                    </div>
                </div>
                <div class="group">
                    <h3><a class="configCode" id="configCode">Thiết lập danh mục hệ thống</a></h3>
                    <div style="padding: 0 !important;">
		            	<div id="jstree_demo"></div>
                    </div>
                </div>
                <div class="group">
                    <h3>Hỗ trợ sử dụng</h3>
                    <div style="padding: 0 !important;">
                        <ul id="" class="ul_Map_QuanLyDLBD">
                            <li>
                                <a class="downloadAllFolder" id="downloadAllFolder" href="#">
                                    <img src="<%=request.getContextPath()%>/img/view_list.png">
                                    Download cả tập hồ sơ
                                </a>
                            </li>

                            <li>
                                <a class="searchFolder" id="searchFolder" href="#">
                                    <img src="<%=request.getContextPath()%>/img/view_list.png">
                                   Tìm kiếm hồ sơ
                                </a>
                            </li>
                        </ul>

                    </div>
                </div>
                <div class="group">
                    <h3><a class="ftpTree" id="ftpTree">Quản lý danh mục và dữ liệu trên ftp Server</a></h3>
                    <div style="padding: 0 !important;">
		            	<div id="jstree_ftp"></div>
                    </div>
                </div>
            </div>
            <!-- Message thông báo trạng thái -->
            <div id="divMsg_Main" style="width: 100%; height: 10%;">
                <h2 class="title-1">
                    <span>THÔNG BÁO</span>
                </h2>
                <div style="border: 1px solid #aaaaaa; height: 57%; overflow: auto; border-top: 0;">
                    <div id="p_Map_alert_info" class="exlc-informed-new"></div>
                </div>
            </div>
        </div>
        <div id="divCenterPanel"
             style="width: 74.56%; float: right; height: 99.7%; border-bottom: 1px solid #aaaaaa; border-right: 1px solid #aaaaaa;">
            <span id="toggle-west" class="toggle-west-close-new"></span>
            <div class="main-content" id ="main-content">
            	<div id="jstree_demo"></div>
            	<%-- <div class="uploadFile">
					<aui:form action="<%= uploadFileURL %>" enctype="multipart/form-data" method="post">
					 
						<aui:input type="file" name="fileupload" />
						
						<aui:button name="Save" value="Save" type="submit" />
					 
					</aui:form>
				</div>
				<div class="createFolder">
					<aui:form action="<%= createFolderURL %>" enctype="multipart/form-data" method="post">
					 
						<aui:input type="text" name="folderName" />
						
						<aui:button name="Save" value="Save" type="submit" />
					 
					</aui:form>
				</div> --%>
			<div class="map-block">
            	<div class="map_div olMap">
                	<div class="form-content">
                    	<div id="s" title="Hồ sơ quét">
							
                            <div class="dialog-content downloadAllFolderDiv hide">
                                <p>
                                    <label for="folderLinkToDownload">Đường dẫn hồ sơ</label>
                                    <input type="text" class="text fix_65_5" placeholder="Đường dẫn hồ sơ" name="folderLinkToDownload" id="folderLinkToDownload">
                                </p>
                                <p style="text-align: center;">
                                    <input type="button" value="Tải toàn bộ" style="margin: 5px;" class="but" id="downloadAllFolderDivBut" />
                                    <input type="button" value="Bỏ qua" class="but btn-active" id="downloadAllFolderDivButCancel" />
                                </p>
                            </div>
                           	<div class="dialog-content ftpInfoDiv hide">
								<p>
                                	<label for="ServerFtp" class='label-field-cls'>Server Ftp</label>
                                    <input type="text" class="text fix_65_5" placeholder="Server Ftp" name="ServerFtp" id="ServerFtp">
								</p>
                                <p>
                                    <label for="UserNameFtp" class='label-field-cls'>Tên đăng nhập</label>
                                    <input type="text" placeholder="Tên đăng nhập" class="text fix_65_5" name="UserNameFtp" id="UserNameFtp">
                                </p>
                                <p>
                                    <label for="PasswordFtp" class='label-field-cls'>Mật khẩu</label>
                                    <input type="text" placeholder="Mật khẩu đăng nhập" class="text fix_65_5" name="PasswordFtp" id="PasswordFtp">
                                </p>
                                <p>
                                    <label for="PortFtp" class='label-field-cls'>Cổng</label>
                                    <input type="text" placeholder="Cổng của ftp" class="text fix_65_5" name="PortFtp" id="PortFtp">
                                </p>
                                <p style="text-align: center;">
                                	<input type="button" value="Hoàn tất" style="margin: 5px;" class="but" id="ftpInfoDivBut" />
                                    <input type="button" value="Bỏ qua" class="but btn-active" id="ftpInfoDivButCancel" />
                                </p>
                            </div>
                           	<div class="dialog-content sizeAndTypeDiv hide">

                                <p>
                                    <label for="sizeFile" class='label-field-cls'>Dung lượng hồ sơ tối đa</label>
                                    <input type="text" class="text fix_65_5" placeholder="Dung lượng hồ sơ tối đa (đơn vị Mb)" name="sizeFile" id="sizeFile">
                                </p>
                                <p>
                                    <label for="typeFile" class='label-field-cls'>Thêm kiểu dữ liệu cho phép</label>
                                    <input type="text" class="text fix_65_5" placeholder="Thêm kiểu dữ liệu cho phép" name="typeFile" id="typeFile">
                                </p>
                                <p style="text-align: center;">
                                    <input type="button" value="Hoàn tất" style="margin: 5px;" class="but" id="sizeAndTypeDivBut" />
                                    <input type="button" value="Bỏ qua" class="but btn-active" id="sizeAndTypeDivButCancel" />
                                </p>
                            </div>
                            <div class="dialog-content backupAndRestoreDiv hide">
                                <p>
                                    <label for="fileNameToRestore" class='label-field-cls'>Chọn file để restore</label>
                                    <input type="text" class="text fix_65_5" placeholder="Chọn file để restore" name="fileNameToRestore" id="fileNameToRestore">
                                </p>
                                <p>
                                    <label for="fileNameToBackup" class='label-field-cls'>Tên file để backup</label>
                                    <input type="text" class="text fix_65_5" placeholder="Tên file để backup(nếu bạn để trống tên file backup sẽ là thời gian lúc backup dữ liệu)" name="fileNameToBackup" id="fileNameToBackup">
                                </p>
                                <p style="text-align: center;">
                                    <input type="button" value="Sao lưu dữ liệu" style="margin: 5px;" class="but" id="btnAddProperties" />
                                    <input type="button" value="Phục hồi dữ liệu" style="margin: 5px;" class="but" id="backupAndRestoreDivBut" />
                                    <input type="button" value="Bỏ qua" class="but btn-active" id="backupAndRestoreDivButCancel" />
                                </p>
                            </div>
                            <!-- START NGUYENNV ADD NEW  -->
                            <div class="dialog-content content-kho hide">
								<p>
                                    <label for="fileNameToRestore" class='label-field-cls'>Tên kho</label>
                                    <input type="text" class="text fix_65_5" name="kho_name" id="kho_name">
                                </p>
                                <p style="text-align: center;">
                                    <input type="button" value="Tạo kho" style="margin: 5px;" class="but" id="btnAddKho" />
                                    <input type="button" value="Bỏ qua" class="but btn-active" id="backupAndRestoreDivButCancel" />
                                </p>								
                            </div>
                            <div class="dialog-content content-tu hide">
								<p>
                                    <label for="fileNameToRestore" class='label-field-cls'>Mã kho chứa</label>
                                    <input type="text" class="text fix_65_5" readonly name="kho_code" id="kho_code">
                                </p>
                                <p>
                                    <label for="fileNameToRestore" class='label-field-cls'>Tên kho chứa</label>
                                    <input type="text" class="text fix_65_5" readonly name="kho_name1" id="kho_name1">
                                </p>
								<p>
                                    <label for="fileNameToRestore" class='label-field-cls'>Tên tủ</label>
                                    <input type="text" class="text fix_65_5" name="tu_name" id="tu_name">
                                </p>
                                <p style="text-align: center;">
                                    <input type="button" value="Tạo tủ" style="margin: 5px;" class="but" id="btnAddTu" />
                                    <input type="button" value="Bỏ qua" class="but btn-active" id="backupAndRestoreDivButCancel" />
                                </p>								
                            </div>
                            <div class="dialog-content content-ke hide">
                            	<p>
                                    <label for="fileNameToRestore" class='label-field-cls'>Mã tủ chứa</label>
                                    <input type="text" class="text fix_65_5" readonly name="tu_code" id="tu_code">
                                </p>
                                <p>
                                    <label for="fileNameToRestore" class='label-field-cls'>Tên tủ chứa</label>
                                    <input type="text" class="text fix_65_5" readonly name="tu_name1" id="tu_name1">
                                </p>
								<p>
                                    <label for="fileNameToRestore" class='label-field-cls'>Tên kệ</label>
                                    <input type="text" class="text fix_65_5" name="ke_name" id="ke_name">
                                </p>
                                <p style="text-align: center;">
                                    <input type="button" value="Tạo kệ" style="margin: 5px;" class="but" id="btnAddKe" />
                                    <input type="button" value="Bỏ qua" class="but btn-active" id="backupAndRestoreDivButCancel" />
                                </p>								
                            </div>
                            <div class="dialog-content content-hop hide">
                            	<p>
                                    <label for="fileNameToRestore" class='label-field-cls'>Mã kệ chứa</label>
                                    <input type="text" class="text fix_65_5" readonly name="ke_code" id="ke_code">
                                </p>
                                <p>
                                    <label for="fileNameToRestore" class='label-field-cls'>Tên kệ chứa</label>
                                    <input type="text" class="text fix_65_5" readonly name="ke_name1" id="ke_name1">
                                </p>
								<p>
                                    <label for="fileNameToRestore" class='label-field-cls'>Tên hộp</label>
                                    <input type="text" class="text fix_65_5" name="hop_name" id="hop_name">
                                </p>
                                <p style="text-align: center;">
                                    <input type="button" value="Tạo hộp" style="margin: 5px;" class="but" id="btnAddHop" />
                                    <input type="button" value="Bỏ qua" class="but btn-active" id="backupAndRestoreDivButCancel" />
                                </p>								
                            </div>
                            <div class="dialog-content content-file hide">
                            	<p>
                                    <label for="fileNameToRestore" class='label-field-cls'>Mã hộp chứa</label>
                                    <input type="text" class="text fix_65_5" readonly name="hop_code" id="hop_code">
                                </p>
                                <p>
                                    <label for="fileNameToRestore" class='label-field-cls'>Tên hộp chứa</label>
                                    <input type="text" class="text fix_65_5" readonly name="hop_name1" id="hop_name1">
                                </p>
								<p>
                                    <label for="fileNameToRestore" class='label-field-cls'>Tên File</label>
                                    <input type="text" class="text fix_65_5" name="file_name" id="file_name">
                                </p>
                                <p>
                                    <label for="fileNameToRestore" class='label-field-cls'>Upload File</label>
                                    <input type="file" class="text fix_65_5" name="fileupload" id="fileupload">
                                </p>
                                <p style="text-align: center;">
                                    <input type="button" value="Upload file" style="margin: 5px;" class="but" id="btnAddFile" />
                                    <input type="button" value="Bỏ qua" class="but btn-active" id="backupAndRestoreDivButCancel" />
                                </p>								
                            </div>
                            <!-- END NGUYENNV ADD NEW  -->
						</div>
					</div>
                </div>
            </div>
        </div>
    </div>
    <!-- div hien thi toa do -->



</body>
</html>